<template>
  <div>
    <div id='loader-wrapper'>
      <div id='loader'></div>
      <div className='loader-section section-left'></div>
      <div className='loader-section section-right'></div>
      <div className='load_title'>正在登录，请耐心等待</div>
    </div>
  </div>
</template>

<script>
import { mapActions } from 'vuex'
import { timeFix, welcome } from '@/utils/util'
import {
  ACCESS_TOKEN,
  INDEX_MAIN_PAGE_PATH,
  INTERFACE_PREFIX,
  UI_CACHE_DB_DICT_DATA,
  USER_INFO,
  USER_NAME
} from '@/store/mutation-types'
import Vue from 'vue'
import { getRoute } from '@api/login'

export default {
  name: 'OAuth2Login',
  data() {
    return {}
  },
  created() {
    this.doOAuth2Login()
  },
  methods: {
    ...mapActions(['EasyWork']),

    /** 进行OAuth2登录操作 */
    doOAuth2Login() {
      // 判断是否携带了Token，是就说明登录成功
      if (this.$route.query.code) {
        this.code = this.$route.query.code
        this.doThirdLogin()
      }
    },

    // 根据token执行登录
    doThirdLogin() {
      let param = {
        code: this.code
      }
      this.EasyWork(param).then(res => {
        if (res.success) {
          this.loginSuccess(res.result)
        } else {
          this.requestFailed(res)
        }
      })
    },
    loginSuccessSync() {
      console.log('是这里登录成功跳转的吗???')
      this.$router.push({ path: '/' }).catch(() => {
        console.log('登录跳转首页出错,这个错误从哪里来的')
      })
      this.$notification.success({
        message: '欢迎',
        description: `${timeFix()}，欢迎回来`,
      })
    },
    loginSuccess(result) {
      const userInfo = result.userInfo
      Vue.ls.set(ACCESS_TOKEN, result.token, 7 * 24 * 60 * 60 * 1000)
      Vue.ls.set(USER_NAME, userInfo.username, 7 * 24 * 60 * 60 * 1000)
      Vue.ls.set(USER_INFO, userInfo, 7 * 24 * 60 * 60 * 1000)
      this.$store.commit('SET_TOKEN', result.token)
      this.$store.commit('SET_INFO', userInfo)
      this.$store.commit('SET_NAME', { username: userInfo.username, realname: userInfo.realname, welcome: welcome() })
      this.$store.commit('SET_AVATAR', userInfo.avatar)
      Vue.ls.set(USER_INFO, result.userInfo, 7 * 24 * 60 * 60 * 1000)
      Vue.ls.set(UI_CACHE_DB_DICT_DATA, result.sysAllDictItems, 7 * 24 * 60 * 60 * 1000)
      // 获取所有应用的接口前缀并存储
      getRoute(result.token, `/jksaas-mgt/mgt/newSys/permission/getRoute`).then((res) => {
        Vue.ls.set(INTERFACE_PREFIX, res.data.result, 7 * 24 * 60 * 60 * 1000)
        this.$store.commit('SET_INTERFACE_PREFIX', res.data.result)
      })
      this.loginSuccessSync()

      // TODO 这个提示是否还需要？
      this.$notification.success({
        message: '欢迎',
        description: `${timeFix()}，欢迎回来`,
      })
    },
    requestFailed(err) {
      this.$error({
        title: '登录失败',
        content: ((err.response || {}).data || {}).message || err.message || '请求出现错误，请稍后再试',
        okText: '重新登陆',
        onOk() {
          window.location.reload()
        },
        onCancel() {
          window.location.reload()
        },
      })
    },

  },
}
</script>

<style scoped></style>